<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>JS随机数</title>
		<style type="text/css">
			body {
				background-color: #FFFAE8;
			}

			#box {
				width: 777px;
				border: 9px dotted #CFB56A;
				margin: 188px auto;
				text-align: center;
				font-size: 18px;
				padding-bottom: 50px;
			}

			h1 {
				color: #41A863;
				font-size: 58px;
			}

			input {
				height: 30px;
				padding-left: 10px;
				font-size: 16px;
			}

			button {
				height: 50px;
				width: 200px;
				line-height: 50px;
				background-color: transparent;
				border: 1px solid #66B1FF;
				border-radius: 25px;
				font-size: 22px;
				color: #66B1FF;
			}

			button:hover {
				background-color: #66B1FF;
				color: #fff;
			}

			#result {
				color: #CB2D01;
				font-size: 88px;
			}
		</style>
	</head>
	<body>

		<div id="box">

			<h1>随机数生成器</h1>
			<p>请输入开始数：<input type="" name="" id="min" value="" /></p>
			<p>请输入结尾数：<input type="" name="" id="max" value="" /></p>
			<p><button type="button" onclick="random()">点击获取结果</button></p>
			<div class="b1" id="result">
			</div>

		</div>

		<script type="text/javascript">
			function random() {
				var min = parseInt(document.getElementById('min').value);
				var max = parseInt(document.getElementById('max').value);

				var range = max - min;
				var rand = Math.random();
				var num = min + Math.round(rand * range);
				// var nums = min + Math.round(Math.random() * (max-min));
				document.getElementById('result').innerHTML = num;
			}
		</script>
	</body>
</html>
